<template>
  <div class="collection" :class="{'highLight':articleObj.is_followed }" @click="active">
    <van-icon name="star" />
  </div>
</template>

<script>
import {collections,collectionsDel } from '@/api/articles'
export default {
  props: {
    articleObj: {
      type: Object,
      default() {
        return {}
      },
    },
  },
  methods : {
     async active(){
        //   console.log(this.$store.state.userToken);
          
          if(this.$store.state.userToken){
               if(this.articleObj.is_collected == false){
                const    res  = await  collections(this.articleObj.art_id)
                console.log(res,777);
                 if(res.status == 201){
                   this.$toast.success('收藏成功');
                 }else{
                   this.$toast.fail('服务器炸了，待会再试吧');
                 }
               
               }else{
                   const  res = await collectionsDel(this.articleObj.art_id)
                    if(res.status == 204){
                         this.$toast.success('取消收藏成功');
                    }else{
                        this.$toast.error('服务器炸了，待会再试吧');
                    }
               }
          }else{
              this.$toast.error('未登录，请先登录');
          }
      }
  }
}
</script>

<style>
.highLight{
    color: skyblue;
}
</style>